<template>
  <!--搜索歌手页-->
  <div class="type100"><!--这是搜素歌手页
      {{this.keyWord}}-->
      <singerhead :info='infoSongs' v-if="infoSongs"/>
      <div v-if="textInfo">
        <introduction :info='textInfo.introduction'/>
      </div>
      
  </div>
</template>

<script>
import require from "requests/singerInfo"
import singerhead from "components/searchComponents/singerInfo"
import introduction from "components/searchComponents/introduction"
export default {
  name: "GrabbleType100",
  data() {
    return {
      keyWord: this.$route.query.keyWord,
      infoSongs: null,
      textInfo:null
    };
  },
  components: {
    singerhead,
    introduction
  },
  watch: {
    $route: "newpage"
  },
  methods: {
    getSongs(value) {
      require.artists(value).then(res => {
        this.infoSongs = res.data.artist;
        //console.log(this.infoSongs);
      });
      require.desc(value).then(res => {
        this.textInfo = res.data;
        //console.log(this.textInfo);
      });
    },
    newpage() {
      this.keyWord = this.$route.query.keyWord;
      this.getSongs(this.keyWord);
    }
  },
  mounted() {
    this.getSongs(this.keyWord);
    //console.log(this.keyWord);
  }
};
</script>

<style scoped lang='less'>
</style>